<script src='{$base_dir}js/AJAX_MedicalRecord.js' type='text/javascript' ></script>
<script type='text/javascript'>
{if isset($newRecord)}	
	var recordId = {$newRecord.record_id};
	{literal}										
	$(document).ready(function() {
		$('#add_record_button').hide();
	{/literal}
		viewOpenRecord(recordId, 1);
	{literal}
	});
	{/literal}
{else}
	{literal}										
	$(document).ready(function() {
		$('#intro_sentence').show();
		showAjaxLoader('ajaxLoader', 'dummy', false);
	});
	{/literal}			
{/if}
{literal}										
$(document).ready(function() {
	$('#encounterList').change(function(){
		$('#encounterList option:selected').each(function () {
			var val = $(this).val();
			if (val != -1 && val != 0) {
				//var prefix = val.charAt(0);
				var suffix = val.substring(1);
				viewOpenRecord(suffix, 1);
			} else if (val == 0) {
				$('#medicalContent').html('');
				$('#medicalSubRecordMenu').hide();
				$('#intro_sentence').show();
			} 
		});
	});
});
{/literal}
</script>
<div>

	<div id='encounterSelector' style='text-align: right;'>
		<select id='encounterList' style='width: 200px'>
			<optgroup id='newEncounterGroup' label='{translate}Open Record{/translate}'>
			{if isset($newRecord)}
				<option id='newEncounter' value='N{$newRecord.record_id}' selected='selected'>{$newRecord.name}</option>						
			{else}
				<option id='noEncounter' value='0' selected='selected'>{translate}Not yet{/translate}!</option>
			{/if}
			</optgroup>
			<optgroup id='oldEncounterGroup' label='{translate}Closed Record{/translate}'>
			{if isset($recordTree)}
				{foreach from=$recordTree item=aRecord}
				<option value='O{$aRecord.record_id}'>{$aRecord.name}</option>						
				{/foreach}
			{else}
				<option value='-1'>{translate}Not yet{/translate}!</option>
			{/if}
			</optgroup>
		</select>
	</div>
	
	<div id='medicalSubRecordMenu' style='display: none; margin-top: 5px;'>
		<table cellspacing='0' cellpadding='0' class='subNavigator' style='width: 100%'>
			<tr>
				<td class='active'>
					<a id='khamLamSang' href='#'>{translate}Clinical examination{/translate}</a>
				</td>
				<td>
					<a id='xetNghiemCls' href='#'>{translate}Laboratory result{/translate}</a>
				</td>
				<td>
					<a id='hinhAnh' href='#'>{translate}Radiology{/translate}</a>
				</td>
				<td>
					<a id='phauThuat' href='#'>{translate}Surgery{/translate}</a>
				</td>
				<td class='last'>
					<a id='toaThuoc' href='#'>{translate}Prescription{/translate}</a>
				</td>
			</tr>
		</table>
	</div>
	<div id='intro_sentence' style='padding: 10px 10px 10px 20px; display: none;'>
		<input type='hidden' id='patient_id' value='{$patientId}'>
		<a class='contentLink' href="javascript:addRecord('component')" id='add_record_button'>
			<img src='{$base_uri}/images/arrow_circle.png' border='0' align='top'/>
			<span>{translate}Create new encounter ticket{/translate}...</span>
		</a>
		<span id='noTicketFound' style='display: none; color: red; font-weight: bold;'>
			{translate}Don't have a service ticket yet. Patient must go to receptionist for making new service ticket before go to examine{/translate}.
		</span>														
	</div>
	<div id='medicalContent'>
	</div>
</div>